<!--回答详情-->
<template>
  <div>
    <el-dialog
      title="回答详情"
      :visible.sync="answerShow"
      width="80%"
      @close="cancel"
      center>

      <div class="dialogTop">
        <div style="margin-right: 50px">用户ID：123123</div>
        <div>用户昵称：孤独的狼</div>
      </div>
      <div class="questionDes">问题描述：
        的点点滴滴的点点滴滴的点点滴滴的点点滴滴的点点滴滴的点点滴滴的点点滴滴的点点滴滴的点点滴滴的点点滴滴
      </div>

      <el-table
        v-loading="listLoading"
        :data="tableData.list"
        border
        size="small" >
        <el-table-column label="序号" type="index" align="center" width="50"></el-table-column>
        <el-table-column label="ID" align="center" prop="id" width="50"></el-table-column>
        <el-table-column label="昵称" align="center" prop="content"></el-table-column>
        <el-table-column label="回答内容" align="center" prop="content"></el-table-column>
        <el-table-column label="评论时间" align="center" prop="content"></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-button type="text" @click="auditLineClick(scope.row)">审核</el-button >
            <el-button type="text" @click="deleteLineClick(scope.row)">删除</el-button >
          </template>
        </el-table-column>
      </el-table>

      <el-pagination
        class="pageRight"
        background
        layout="total, sizes, prev, pager, next, jumper"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="searchForm.pageSize"
        :total="tableData.total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      ></el-pagination>

    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      answerShow: false,
      tableData: {
        total: 0,
        list: [
          {
            id: '1',
            content: '123456'
          }
        ]
      },
      listLoading: false,
      searchForm: {
        pageNum: 1,
        pageSize: 10,
      },
    }
  },
  methods: {
    cancel() {
      this.answerShow = false
    },
    openDialog(v) {
      this.answerShow = true
    },
    // 审核
    auditLineClick() {},
    // 删除
    deleteLineClick(row) {
      this.$confirm("是否确认删除?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        deleteAnswerApi(row.id).then(() => {
          this.$message.success("删除成功！");
          this.getList();
        })
      });
    },
    handleSizeChange(val) {
      this.searchForm.pageSize = val;
      this.getList();
    },
    handleCurrentChange(val) {
      this.searchForm.pageNum = val;
      this.getList();
    }
  }
}
</script>

<style lang="scss" scoped>
.dialogTop {
  display: flex;
  margin-bottom: 20px;
}
.questionDes {
  margin-bottom: 20px;
}
</style>
